<template>
	<view>
		<input 
		:class="[`${PREFIX}`]" 
		type="text" 
		:placeholder="placeholder" 
		@input="input"
		@focus="focus"
		>
	</view>
</template>

<script>
	const PREFIX = 'CInput'
	export default {
		name: "input",
		data() {
			return {
				PREFIX
			};
		},
		props: {
			placeholder: {
				type: String,
				default: 'placeholder'
			}
		},
		methods: {
			input(e) {
				let value = e.target.value
				this.$emit('input', value)
			},
			focus(){
				this.$emit('focus')
			}
		}
	}
</script>

<style lang="less">
	.CInput {
		width: 100%;
		height: 36px;
		box-sizing: border-box;
		border-radius: 18px;
		background: #F2F3F7;
		border-radius: 18px;
		padding: 0 16px;
		color: #c0c2cb;
	}
</style>